/* eslint-disable react-hooks/rules-of-hooks */
import React, { useEffect, useState } from "react";
import { Button, Form, Input, Select,DatePicker } from "antd";
import {  useNavigate } from "react-router-dom";
import type { DatePickerProps, RangePickerProps } from "antd/es/date-picker";
import "../../../styles/HuangYuDong/YuanGong/YGAdd.scss";
import { hyd_yuangong_add } from "../../../api/HuangYuDong/yuangong";
interface Props {}
function YGAdd(props: Props) {

 // 时间
 let [time, useTime] = useState("");
 const { RangePicker } = DatePicker;
 const onChange = (
   value: DatePickerProps["value"] | RangePickerProps["value"],
   dateString: string
 ) => {
   console.log(dateString);
   useTime(dateString);
 };


  const onFinish = (values: any) => {
    console.log("Success:", values);
    hyd_yuangong_add({
        name: values.name,
        bumen: values.bumen,
        zhiwei: values.zhiwei,
        didian:  values.didian,
        leixing: values.leixing,
        gonghao: values.gonghao,
        shoujihao:values.shoujihao ,
        chengshi: values.chengshi,
        zhuangtai:values.zhuangtai ,
        youxiang: values.youxiang,
        zhengjianleixing:values.zhengjianleixing,
        zhengjian:values.zhengjian,
        time: time,
      }).then((ok) => {
        console.log(ok);
        navigate(-1);
      });
  

  };

  let navigate = useNavigate();
  let fanhui = () => {
    navigate(-1);
  };
  return (
    <div className="YGAdd">
      <div className="center">
        <h2>新增员工</h2>
        <Form
          className="form"
          name="basic"
          initialValues={{ remember: true }}
          onFinish={onFinish}
          autoComplete="off"
          labelCol={{ span: 4 }}
          wrapperCol={{ span: 14 }}
          layout="horizontal"
          style={{ maxWidth: 600 }}
        >
          <Form.Item
            label="姓名"
            name="name"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="部门组织"
            name="bumen"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="行销部">行销部</Select.Option>
              <Select.Option value="设计部">设计部</Select.Option>
              <Select.Option value="产品部">产品部</Select.Option>
            </Select>
          </Form.Item>

          <Form.Item
            label="职位"
            name="zhiwei"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="产品经理">产品经理</Select.Option>
              <Select.Option value="设计主管">设计主管</Select.Option>
              <Select.Option value="设计师">设计师</Select.Option>
              <Select.Option value="前台">前台</Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label="工作地点"
            name="didian"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="总公司 总部">总公司 总部</Select.Option>
              <Select.Option value="杭州分部 分公司">
                杭州分部 分公司
              </Select.Option>
              <Select.Option value="海南分部 分公司">
                海南分部 分公司
              </Select.Option>
              <Select.Option value="天津分部 办事处">
                天津分部 办事处
              </Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label="员工类型"
            name="leixing"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="全职">全职</Select.Option>
              <Select.Option value="兼职">兼职</Select.Option>
              <Select.Option value="实习">实习</Select.Option>
              <Select.Option value="临时工">临时工</Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label="工号"
            name="gonghao"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="手机号"
            name="shoujihao"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Input />
          </Form.Item>

          <Form.Item
            label="工作城市"
            name="chengshi"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="上海">上海</Select.Option>
              <Select.Option value="杭州">杭州</Select.Option>
              <Select.Option value="海南">海南</Select.Option>
              <Select.Option value="天津">天津</Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label="员工状态"
            name="zhuangtai"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="试用"> 试用</Select.Option>
              <Select.Option value="临时">临时 </Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label="证件类型"
            name="zhengjianleixing"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Select>
              <Select.Option value="身份证"> 身份证</Select.Option>
              <Select.Option value="临时">临时 </Select.Option>
            </Select>
          </Form.Item>
          <Form.Item
            label="身份证号"
            name="zhengjian"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="入职时间"
            name="time"
            rules={[{ required: true, message: "请输入！！！" }]}
          >
            <DatePicker showTime onChange={onChange} />
          </Form.Item>
          <Form.Item wrapperCol={{ offset: 4, span: 16 }}>
            <Button type="primary" htmlType="submit">
              保存
            </Button>
            <Button
              onClick={() => {
                fanhui();
              }}
              className="button_right"
            >
              取消
            </Button>
          </Form.Item>
        </Form>
      </div>
    </div>
  );
}

export default YGAdd;
